<template>
  <el-dialog
    :title="!dataForm.id ? '新建' : isDetail ? '详情' : '编辑'"
    :close-on-click-modal="false"
    :visible.sync="visible"
    class="JNPF-dialog JNPF-dialog_center"
    lock-scroll
    width="50%"
  >
    <el-form
      ref="elForm"
      :model="dataForm"
      size="medium"
      label-width="auto"
      label-position="right"
      :disabled="!!isDetail"
      :rules="rules"
    >
      <div class="el-table el-table--border submit-table">
        <table>
          <colgroup>
            <col width="180" />
          </colgroup>
          <thead>
            <tr>
              <th>风险等级</th>
              <th>重大风险</th>
              <th>较大风险</th>
              <th>一般风险</th>
              <th>低风险</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>复评提醒周期</td>
              <td>
                <el-form-item label="" prop="gfx">
                  <el-input
                    v-model.number="dataForm.gfx"
                    placeholder="请输入天数"
                    clearable
                    :style="{ width: '100%' }"
                    prefix-icon=""
                    suffix-icon=""
                  >
                    <template slot="prepend"></template>
                    <template slot="append"></template>
                  </el-input>
                </el-form-item>
              </td>
              <td>
                <el-form-item label="" prop="jdfx">
                  <el-input
                    v-model.number="dataForm.jdfx"
                    placeholder="请输入天数"
                    clearable
                    :style="{ width: '100%' }"
                    prefix-icon=""
                    suffix-icon=""
                  >
                    <template slot="prepend"></template>
                    <template slot="append"></template>
                  </el-input>
                </el-form-item>
              </td>
              <td>
                <el-form-item label="" prop="ybfx">
                  <el-input
                    v-model.number="dataForm.ybfx"
                    placeholder="请输入天数"
                    clearable
                    :style="{ width: '100%' }"
                    prefix-icon=""
                    suffix-icon=""
                  >
                    <template slot="prepend"></template>
                    <template slot="append"></template>
                  </el-input>
                </el-form-item>
              </td>
              <td>
                <el-form-item label="" prop="dfx">
                  <el-input
                    v-model.number="dataForm.dfx"
                    placeholder="请输入天数"
                    clearable
                    :style="{ width: '100%' }"
                    prefix-icon=""
                    suffix-icon=""
                  >
                    <template slot="prepend"></template>
                    <template slot="append"></template>
                  </el-input>
                </el-form-item>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取 消</el-button>
      <el-button type="primary" @click="dataFormSubmit()" v-if="!isDetail"
        >确 定</el-button
      >
    </span>
  </el-dialog>
</template>
<script>
import request from "@/utils/request";
import { getDictionaryDataSelector } from "@/api/systemData/dictionary";
import { previewDataInterface } from "@/api/systemData/dataInterface";
export default {
  data() {
    return {
      visible: false,
      isDetail: false,
      dataForm: {
        gfx: null,
        jdfx: null,
        ybfx: null,
        dfx: null,
      },
      rules: {
        gfx: [
          { required: true, message: "周期不能为空" },
          { type: "number", message: "周期必须为数字值" },
        ],
        jdfx: [
          { required: true, message: "周期不能为空" },
          { type: "number", message: "周期必须为数字值" },
        ],
        ybfx: [
          { required: true, message: "周期不能为空" },
          { type: "number", message: "周期必须为数字值" },
        ],
        dfx: [
          { required: true, message: "周期不能为空" },
          { type: "number", message: "周期必须为数字值" },
        ],
      },
    };
  },
  created() {},
  methods: {
    goBack() {
      this.$emit("refresh");
    },
    init(id, isDetail) {
      this.dataForm.id = id || 0;
      this.visible = true;
      this.isDetail = isDetail || false;
      this.$nextTick(() => {
        this.$refs["elForm"].resetFields();
        if (this.dataForm.id) {
          request({
            url: "/api/System/qyscPjzq/" + this.dataForm.id,
            method: "get",
          }).then((res) => {
            let newData = {
              dfx: Number(res.data.dfx),
              gfx: Number(res.data.gfx),
              id: res.data.id,
              jdfx: Number(res.data.jdfx),
              ybfx: Number(res.data.ybfx),
            };
            this.dataForm = newData;
          });
        }
      });
    },
    // 表单提交
    dataFormSubmit() {
      this.$refs["elForm"].validate((valid) => {
        if (valid) {
          if (!this.dataForm.id) {
            request({
              url: "/api/System/qyscPjzq",
              method: "post",
              data: this.dataForm,
            }).then((res) => {
              this.$message({
                message: res.msg,
                type: "success",
                duration: 1000,
                onClose: () => {
                  this.visible = false;
                  this.$emit("refresh", true);
                },
              });
            });
          } else {
            request({
              url: "/api/System/qyscPjzq/" + this.dataForm.id,
              method: "PUT",
              data: this.dataForm,
            }).then((res) => {
              this.$message({
                message: res.msg,
                type: "success",
                duration: 1000,
                onClose: () => {
                  this.visible = false;
                  this.$emit("refresh", true);
                },
              });
            });
          }
        }
      });
    },
  },
};
</script>

<style scoped>
.submit-table td,
.submit-table th {
  padding: 12px 10px;
  text-align: center;
}
</style>